
import React from 'react';
import PropTypes from 'prop-types';
import {injectIntl} from './intl';
import {Card, Row, Col, Table, Divider} from 'antd';
import {conventEnumValueToString, formatAmount, formatDateTime} from '../utils';
import {saleOrderTransportType, packingBusinessType, currency, packingListType, transportType, packingType} from '../Enum';
import DescriptionList from 'ant-design-pro/lib/DescriptionList';
import {TABLE, DATE_FORMAT, FILES_API} from '../constants';
const {Description} = DescriptionList;
import styles from './style.css';
/* eslint-disable react/prefer-stateless-function */
const rowKey = record => `${record.id}`;
class Detail extends React.PureComponent {
    render() {
        const {details = [], salePackingPartListDetails = [], attachments = []} = this.props.detail;
        let totalWeight = 0;
        salePackingPartListDetails.map((v, i) => Object.assign(v, {num: i + 1}));
        details.forEach(o => {
            totalWeight += (o.netWeight);
        });
        const columns = [{
            title: this.props.intl.formatMessage({
                id: 'commonDetail.column.serialNums',
                defaultMessage: '序号'
            }),
            dataIndex: 'serialNums',
        },
        {
            title: this.props.intl.formatMessage({
                id: 'commonDetail.column.palletCode',
                defaultMessage: '托盘号'
            }),
            dataIndex: 'palletCode',
        },
        {
            title: this.props.intl.formatMessage({
                id: 'commonDetail.column.kdBomCode',
                defaultMessage: 'KDBOM号'
            }),
            dataIndex: 'kdBomCode',
        }, {
            title: this.props.intl.formatMessage({
                id: 'commonDetail.column.kdBomVersionCode',
                defaultMessage: 'KDBOM版本号'
            }),
            dataIndex: 'kdBomVersionCode',
        },
        {
            title: this.props.intl.formatMessage({
                id: 'commonDetail.column.quantity',
                defaultMessage: '数量'
            }),
            dataIndex: 'quantity',
        },
        {
            title: this.props.intl.formatMessage({
                id: 'commonDetail.column.price',
                defaultMessage: '单价'
            }),
            dataIndex: 'price',
            render: text => formatAmount(text)
        },
        {
            title: this.props.intl.formatMessage({
                id: 'commonDetail.column.totalAmount',
                defaultMessage: '总价'
            }),
            dataIndex: 'totalAmount',
            render: text => formatAmount(text)
        },
        {
            title: this.props.intl.formatMessage({
                id: 'commonDetail.column.perNetWeight',
                defaultMessage: '单位净重'
            }),
            dataIndex: 'perNetWeight',
            render: text => formatAmount(text, 3)
        },
        {
            title: this.props.intl.formatMessage({
                id: 'commonDetail.column.netWeight',
                defaultMessage: '总净重'
            }),
            dataIndex: 'netWeight',
            render: text => formatAmount(text, 3)
        }
        ];
        const partColumns = [{
            title: this.props.intl.formatMessage({
                id: 'commonDetail.column.num',
                defaultMessage: '序号'
            }),
            dataIndex: 'num',
        },
        
        {
            title: this.props.intl.formatMessage({
                id: 'commonDetail.column.partCode',
                defaultMessage: '备件编号'
            }),
            dataIndex: 'partCode',
        }, {
            title: this.props.intl.formatMessage({
                id: 'commonDetail.column.partName',
                defaultMessage: '备件名称'
            }),
            dataIndex: 'partName',
        },
        {
            title: this.props.intl.formatMessage({
                id: 'commonDetail.column.partEngName',
                defaultMessage: '备件英文名称'
            }),
            dataIndex: 'partEngName',
        },
        {
            title: this.props.intl.formatMessage({
                id: 'commonDetail.column.quantity',
                defaultMessage: '数量'
            }),
            dataIndex: 'quantity',
        },
        {
            title: this.props.intl.formatMessage({
                id: 'commonDetail.column.price',
                defaultMessage: '单价'
            }),
            dataIndex: 'price',
            render: text => formatAmount(text)
        },
        {
            title: this.props.intl.formatMessage({
                id: 'commonDetail.column.totalPrice',
                defaultMessage: '总价'
            }),
            dataIndex: 'totalPrice',
            render: text => formatAmount(text)
        }
        ];
        if(this.props.detail.businessType === packingBusinessType.KD索赔)
            partColumns.splice(2, 0, ...[
                {
                    title: this.props.intl.formatMessage({
                        id: 'commonDetail.column.kdClaim',
                        defaultMessage: 'KD索赔单号'
                    }),
                    dataIndex: 'kdClaim',
                },
            ]);
        return (
            <div>
                <Card>
                    <DescriptionList size="large" title={<Row><Col span={6}>{this.props.intl.formatMessage({
                        id: 'commonDetail.order.title',
                        defaultMessage: '整车包装箱单信息'
                    })}</Col>
                    <Col className={styles.optionBtn} span={18}>{this.props.operations}</Col></Row>}>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.code',
                                defaultMessage: '编号'
                            })}>
                            {this.props.detail.code}
                        </Description>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.brandName',
                                defaultMessage: '品牌名称'
                            })}>
                            {this.props.detail.brandName}
                        </Description>
                        <Description term={this.props.intl.formatMessage({
                            id: 'commonDetail.info.dealer',
                            defaultMessage: '总代'
                        })}>({this.props.detail.dealerCode}){this.props.detail.dealerName}</Description>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.saleConfirmationrCode',
                                defaultMessage: '销售确认书编号'
                            })}>
                            {this.props.detail.saleConfirmationrCode}
                        </Description>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.batchNumber',
                                defaultMessage: '批次号'
                            })}>
                            {this.props.detail.batchNumber}
                        </Description>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.transBatchNumber',
                                defaultMessage: '发运批次号'
                            })}>
                            {this.props.detail.transBatchNumber}
                        </Description>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.containerCode',
                                defaultMessage: '集装箱号'
                            })}>
                            {this.props.detail.containerCode}
                        </Description>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.sealCode',
                                defaultMessage: '密封码'
                            })}>
                            {this.props.detail.sealCode}
                        </Description>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.businessType',
                                defaultMessage: '业务类型'
                            })}>
                            {conventEnumValueToString(packingBusinessType, this.props.detail.businessType)}
                        </Description>
                        <Description term={this.props.intl.formatMessage({
                            id: 'commonDetail.info.currency',
                            defaultMessage: '币种'
                        })}>{conventEnumValueToString(currency, this.props.detail.currency)}
                        </Description>
                        <Description term={this.props.intl.formatMessage({
                            id: 'commonDetail.info.transportType',
                            defaultMessage: '运输方式'
                        })}>{conventEnumValueToString(saleOrderTransportType, this.props.detail.transportType)}
                        </Description>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.packingType',
                                defaultMessage: '包装类型'
                            })}>
                            {conventEnumValueToString(packingType, this.props.detail.packingType)}
                        </Description>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.container',
                                defaultMessage: '包装规格'
                            })}>
                            {this.props.detail.container}
                        </Description>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.status',
                                defaultMessage: '状态'
                            })}>
                            {conventEnumValueToString(packingListType, this.props.detail.status)}
                        </Description>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.length',
                                defaultMessage: '长度(mm)'
                            })}>
                            {this.props.detail.length}
                        </Description>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.width',
                                defaultMessage: '宽度(mm)'
                            })}>
                            {this.props.detail.width}
                        </Description>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.height',
                                defaultMessage: '高度(mm)'
                            })}>
                            {this.props.detail.height}
                        </Description>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.volume',
                                defaultMessage: '体积(m3)'
                            })}>
                            {formatAmount(this.props.detail.volume, 3)}
                        </Description>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.netWeight',
                                defaultMessage: '净重(kg)'
                            })}>
                            {formatAmount(this.props.detail.netWeight, 2)}
                        </Description>
                        <Description
                            term={this.props.intl.formatMessage({
                                id: 'commonDetail.info.grossWeight',
                                defaultMessage: '毛重(kg)'
                            })}>
                            {formatAmount(this.props.detail.grossWeight, 2)}
                        </Description>
                        <Description term={this.props.intl.formatMessage({
                            id: 'commonDetail.info.creatorName',
                            defaultMessage: '创建人姓名'
                        })}>{this.props.detail.creatorName}</Description>
                        <Description term={this.props.intl.formatMessage({
                            id: 'commonDetail.info.createTime',
                            defaultMessage: '创建时间'
                        })}>{formatDateTime(this.props.detail.createTime, DATE_FORMAT)}</Description>
                        <Description term={this.props.intl.formatMessage({
                            id: 'commonDetail.info.modifierName',
                            defaultMessage: '修改人姓名'
                        })}>{this.props.detail.modifierName}</Description>
                        <Description term={this.props.intl.formatMessage({
                            id: 'commonDetail.info.modifyTime',
                            defaultMessage: '修改时间'
                        })}>{formatDateTime(this.props.detail.modifyTime, DATE_FORMAT)}</Description>
                        <Description term={this.props.intl.formatMessage({
                            id: 'commonDetail.info.abandonerName',
                            defaultMessage: '作废人姓名'
                        })}>{this.props.detail.abandonerName}</Description>
                        <Description term={this.props.intl.formatMessage({
                            id: 'commonDetail.info.abandonTime',
                            defaultMessage: '作废时间'
                        })}>{formatDateTime(this.props.detail.abandonTime, DATE_FORMAT)}</Description>
                    </DescriptionList>
                    <DescriptionList col={1} className={styles.mgtp} size="large">
                        <Description term={this.props.intl.formatMessage({
                            id: 'commonDetail.info.remark',
                            defaultMessage: '备注'
                        })}>
                            {this.props.detail.remark}
                        </Description>
                    </DescriptionList>
                </Card>
                <Card
                    title={this.props.intl.formatMessage({
                        id: 'commonDetail.details.partTitle',
                        defaultMessage: '整车包装箱单备件清单'
                    })}
                    bordered={false}>
                    <Table className="white-space-nowrap" rowKey={rowKey} columns={partColumns} pagination={false} dataSource={salePackingPartListDetails} {...TABLE} />
                    
                    
                </Card>
                <Divider/>
                <Card
                    title={this.props.intl.formatMessage({
                        id: 'commonDetail.details.title',
                        defaultMessage: '整车包装箱单清单'
                    })}
                    bordered={false}>
                    <Table className="white-space-nowrap" rowKey={rowKey} columns={columns} pagination={false} dataSource={details} {...TABLE} />
                    
                    
                </Card>
                <Divider/>
                
                {attachments && attachments.length > 0
                    ? <DescriptionList title={this.props.intl.formatMessage({
                        id: 'commonDetail.card.attachment',
                        defaultMessage: '附件清单'
                    })} size="large">
                        {attachments.map(item => (<Description key={item.fileId}>
                            <a icon="download" download href={`${FILES_API.files}/${item.fileId}`} size="small">
                                {item.fileName}</a></Description>))}
                    </DescriptionList>
                    : this.props.intl.formatMessage({
                        id: 'commonDetail.content.noAttachment',
                        defaultMessage: '暂无附件'
                    })}
            </div>
        );
    }
}

Detail.defaultProps = {
    detail: {},
};

Detail.propTypes = {
    detail: PropTypes.object,
    intl: PropTypes.object,
    isDetail: PropTypes.bool,
    operations: PropTypes.any,
};
export default injectIntl(Detail);
